<%@page import="org.cadet.client.model.UserManagement, org.cadet.util.model.Constants"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js">
<!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>CO-THINKER | Dashboard</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width">

        <link rel="stylesheet" href="../css/bootstrap.css">
        <link rel="icon" type="image/ico" href="../img/favicon.ico">
        <style>
          body {
                padding-top: 60px;
                padding-bottom: 40px;
            }
            footer {
				background: none scroll repeat 0 0 #FFFFFF;
			}
        </style>
        <link rel="stylesheet" href="../css/bootstrap-responsive.css">
        <link rel="stylesheet" href="css/main.css">
    </head>
    <body>
        <!--[if lt IE 7]>
            <p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
        <![endif]-->
        <jsp:include page="/client/NavBar.jsp"></jsp:include>	
			<!--/.navbar -->
        
        <div class="container-fluid">
        	<div class="row">
                <jsp:include page="/client/Accordian.jsp"></jsp:include>	
			<!--/#accordion -->

				
				<div class="container-fluid span9">
				<div class="container-fluid span9 offset*">
                    <div class="navbar">
                        <div class="navbar-inner">
                            <div class="container-fluid pull-left">
                            	<table>
                           			<tr>
                           				<td valign="bottom" style="padding-top: 5px"><a class="brand" href="#">Thoughts</a></td>
                           			</tr>
                           		</table>
                            </div>
                            <div class="container-fluid pull-right">
                            	<table>
                           			<tr>
                           				<td><a class="brand" href="#">Select Authors:</a></td>
                           				<td valign="bottom" style="padding-top: 10px">
                           					
                           					<select id="selAuthor" onChange="viewThought()"> 
                           						<option id="0">You Followed</option>
							                	<c:if test="${requestScope.status eq 'success'}">
							                		<c:forEach items="${requestScope.authors}" var="user">
							                			<c:if test="${user.userLogin ne 'none'}">
							                				<option id="${user.userId}">${user.displayName}</option>
							                			</c:if>
								                    </c:forEach>
								                </c:if>
		                        			</select>
                           				</td>
                           			</tr>
                            	</table>
                            </div>
                        </div>
                    </div>
                    <% int cnt=1; %>
	                    <div>
	                    	<input type="submit" id="btnSubmit" name="btnSubmit" style="display:none;" value=""/>
	                		<table>
			                    <tr>
			                        <td colspan="3">
										<c:if test="${requestScope.status eq 'success'}">
											<input type="hidden" id="hdnAuthorId" name="hdnAuthorId" value="${requestScope.authorId}"/>
											<input type="hidden" id="hdnThoughtId" name="hdnThoughtId" value=""/>
											<div class="accordion" id="accordionThought">
					                			<c:forEach items="${requestScope.thoughts}" var="thought">
													<div id="div${thought.thoughtId}" class="accordion-group">
														<div class="accordion-heading span9">
															<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionThought" href="#collapseThought${thought.thoughtId}">
																<c:set var="thoughtBegining" value="${fn:substring(thought.thoughtTitle, 0, 50)}" />
																<table>
																	<tr>
																		<td class="span7" style="font-weight: 600;">${thoughtBegining}</td>
																		<td class="pull-right">By: ${thought.authorName}</td>
																	</tr>
																</table>
															</a>
												    	</div>
														<div id="collapseThought${thought.thoughtId}" class="accordion-body collapse">
															<div class="accordion-inner span9">
																<table style="width:100%">
																	<tr>
																		<td style="" class="span9" colspan="2" align="justify">
																			<label id="txtThought${thought.thoughtId}" name="txtThought${thought.thoughtId}" style="background-color:white; border:none; rows="4" readonly="readonly">${thought.thoughtContent}</label>
																		</td>
																		<td style="margin-right:50px;" class="pull-right" colspan="2" align="right" valign="top">
																			<c:set var="thoughtDate" value="${fn:substring(thought.thoughtDate, 0, 19)}" />
																			<label id="txtThoughtDate${thought.thoughtId}" name="txtThoughtDate${thought.thoughtId}" style="background-color:white; color:#929292; border:none; rows="4" readonly="readonly">${thoughtDate}</label>
																		</td>
																	</tr>
																</table>
															</div>
														</div>
													</div>
							                    </c:forEach>
											</div>
						                </c:if>
			                        </td>
			                    </tr>
			                </table>
			                <input type="hidden" id="websiteCoreFolder" name="websiteCoreFolder" value="<%=Constants.websiteCoreFolder %>" />
	    				</div>
	                </div>
				</div>
			</div>	<!--/.row div -->
        </div>	<!--/.container div -->

		<hr>
		
        <jsp:include page="/client/Footer.jsp"></jsp:include>	
        <script src="../js/jquery-1.8.2.js"></script>
        <script src="../js/bootstrap.js"></script>
    	<script src="js/main.js"></script>
        <script src="../js/bootbox.js"></script>
        <script src="../js/nicEdit.js"></script>
        <script src="../js/modernizr-2.6.1-respond-1.1.0.min.js"></script>
		

        <script type="text/javascript">
    		$("#dashboard").addClass("active");
    	</script>
        <script type="text/javascript">
        
    		window.addEventListener('load', doFirst, false);
    		
    		function doFirst(){
        		var author = document.getElementById("hdnAuthorId").value;
       			var authorOptions = document.getElementById("selAuthor");
       		    for(var i = 0; i < authorOptions.length; i++){
       		        if(authorOptions[i].id == author){
       		        	authorOptions[i].selected = true;
       		        }
       		    }
    		}
        
        	function viewThought(){
    			var e = document.getElementById("selAuthor");
    			var authorId = e.options[e.selectedIndex].id;
    			var websiteCoreFolder = document.getElementById("websiteCoreFolder").value;
    			window.location = websiteCoreFolder + "/client/dashboard?hdnAuthorId=" + authorId;
        	}

        </script>
    </body>
</html>
